<script setup lang="ts"></script>

<template>
  <el-dialog v-bind="$props">
    <template #title>
      <slot name="title" />
    </template>
    <el-scrollbar max-height="calc(70vh - 116px)" class="re-scrollbar">
      <slot />
    </el-scrollbar>
    <template #footer>
      <slot name="footer" />
    </template>
  </el-dialog>
</template>

<style lang="scss" scoped>
.re-scrollbar {
  margin: calc(var(--el-dialog-padding-primary) * -1)
    calc(var(--el-dialog-padding-primary) * -1);
}

.re-scrollbar :deep(.el-scrollbar__view) {
  padding: calc(var(--el-dialog-padding-primary) + 10px)
    var(--el-dialog-padding-primary);
}
</style>

<style scoped lang="scss"></style>
